<template>
<el-tabs type="border-card" class="demo-tabs wrapper" >
    <el-tab-pane>
      <template #label>
        <span class="custom-tabs-label">
          <el-icon><Position/></el-icon>
          <span>当月okr绩效结果</span>
        </span>
      </template>
      <NowOkr></NowOkr>
    </el-tab-pane>
    <el-tab-pane label="历史审核人与审核时限">
      <template #label>
        <span class="custom-tabs-label">
          <el-icon><Collection/></el-icon>
          <span>历史okr绩效结果</span>
        </span>
      </template>
      <PastOkr></PastOkr>
    </el-tab-pane>
  </el-tabs>
</template>


<script setup>
import {ref, onMounted,onBeforeMount, reactive,watch} from "vue";
import { Timer } from '@element-plus/icons-vue';
import {useRouter} from "vue-router";
import { ElMessage } from 'element-plus'
import NowOkr from './components/nowOkr'
import PastOkr from './components/pastOkr'

</script>

<style lang="scss" scoped>
.demo-tabs > .el-tabs__content {
  padding: 32px;
  color: #6b778c;
  font-size: 32px;
  font-weight: 600;
}

.el-tabs--right .el-tabs__content,
.el-tabs--left .el-tabs__content {
  height: 100%;
}

.fix{
  position:fix;
  top:0;
  left: 0;
}

.button{
  margin-left:205px;
  float: left;
}

.wrapper{
  box-shadow: 0px 0px 10px 3px  #00000014;
  border-bottom-right-radius:15px;
  border-bottom-left-radius:15px;
}
</style>